<!DOCTYPE html>
<html>
<head>
<title>注册.html</title>

<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="this is my page">
<meta name="content-type" content="text/html; charset=UTF-8">

<script src="formValidator/jquery-1.4.4.js" type="text/javascript"></script>
<link type="text/css" rel="stylesheet"
	href="formValidator/style/validator.css"></link>
<script src="formValidator/formValidator-4.0.1.js"
	type="text/javascript" charset="UTF-8"></script>
<script src="formValidator/formValidatorRegex.js" type="text/javascript"
	charset="UTF-8"></script>

<script type="text/javascript">
	function register() {
		var userInfo = new Object();
		var date = new Date();
		var username = document.getElementById("username").value;
		var password = document.getElementById("password").value;
		var repassword = document.getElementById("repassword").value;
		var classnum = document.getElementById("classnum").value;
		var email = document.getElementById("email").value;
		var level = $("input[name='level']:checked").val();

		userInfo.userid = date.toTimeString().replace(/[^a-z0-9]+/gi, '');
		userInfo.classnum = classnum;
		userInfo.level = level;
		userInfo.username = username;
		userInfo.password = password;
		userInfo.email = email;
		// 		alert("username: " + username + " password: " + password + " email: "
		// 				+ email + " level: " + level + " classnum: " + classnum 	addidvalue : true,
		// 				+ " userid: " + userInfo.userid);
		if (password != repassword || username.length == 0
				|| email.indexOf('@') < 0 || password.length < 6
				|| classnum.length == 0) {
			alert("输入有误，请改正");
		} else {
			$.ajax({
				type : "POST",
				url : "../user/regist",
				dataType : "json",
				contentType : "application/json",
				data : JSON.stringify(userInfo),
				success : function(data) {
					if (data.states == "ERROR") {
						alert("输入有误，请重新输入");
					} else if (data.states == "NAMEEXIST") {
						alert("用户名已存在，请更换");
					} else if(data.states == "EMAILEXIST"){
						alert("该邮箱已经被注册");
					}else{
						alert("注册成功，点击确定返回首页");
						window.location.href = "../bootstrap/home.html";
					}
				}
			});
		}
	}
</script>

<script type="text/javascript">
	$(document).ready(function() {
		$.formValidator.initConfig({
			formID : "form1",
			onError : function() {
				alert("您的信息未填写完整,请检查");
			},
			onSuccess : function() {
			}
		});

		$(":radio[name='level']").formValidator({
			tipID : "levelTip",
			onShow : "必选",
		}).inputValidator({
			min : 1,
			max : 1,
			onError : "必选"
		});

		$("#email").formValidator({
			onShow : "请输入你的email",
		}).regexValidator({
			regExp : "email",
			dataType : "enum",
			onError : "email格式不正确"
		});

		$("#username").formValidator({
			onShow : "请输入你得用户名",
			onFocus : "请输入你得用户名",
			onCorrect : "输入正确"
		}).regexValidator({
			regExp : "notempty",
			dataType : "enum",
			onError : "用户名不能为空或者有空格"
		});

		$("#password").formValidator({
			onShow : "请输入密码",
			onFocus : "至少6个长度",
			onCorrect : "密码合法"
		}).inputValidator({
			min : 6,
			empty : {
				leftEmpty : false,
				rightEmpty : false,
				emptyError : "密码两边不能有空符号"
			},
			onError : "密码不合格"
		});
		$("#repassword").formValidator({
			onShow : "输再次输入密码",
			onFocus : "至少6个长度",
			onCorrect : "密码一致"
		}).inputValidator({
			min : 6,
			empty : {
				leftEmpty : false,
				rightEmpty : false,
				emptyError : "重复密码两边不能有空符号"
			},
			onError : "重复密码不合格"
		}).compareValidator({
			desID : "password",
			operateor : "=",
			onError : "2次密码不一致,请确认"
		});
		$("#classnum").formValidator({
			onShow : "请输入班级名",
			onFocus : "格式如：（301，612）",
			onError : "格式错误"
		}).regexValidator({
			regExp : "num",
			dataType : "enum",
		});
	});
</script>
<style type="text/css">
.put {
	display: block;
	position: relative;
	float: left;
	height: 16px;
	width: 328px;
	padding: 11px 10px 11px 10px;
	margin-right: 10px;
	border: 1px solid #ddd;
	font-size: 14px;
	color: #666;
	transition: .3s;
	-moz-transition: .3s;
	-o-transition: .3s;
	-webkit-transition: .3s;
}

.bt {
	background-color: #3f89ec;
	width: 184px;
	height: 39px;;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 25px;
	color: aliceblue;
}

.bt:HOVER {
	background-color: #0000ec;
	width: 184px;
	height: 39px;;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 25px;
	color: aliceblue;
}

.txt {
	margin: 0;
	padding: 0;
	line-height: 1.5em;
	font-family: "Times New Roman", Times, serif;
	font-size: 20px;
	color: #000000;
}

body {
	background: rgb(246, 248, 249);
	background: url('images/注册/bg.jpg') no-repeat center fixed;
	background-attachment: fixed;
	background-size: 100% 100%;
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/注册/bg.jpg',
		sizingMethod='scale');
	background-repeat: no-repeat;
	background-positon: 100%, 100%;
	font: normal 12px tahoma, arial, verdana, sans-serif;
	margin: 0;
	padding: 0;
	border: 0 none;
	height: 100%;
}
</style>

</head>

<body>

	<div style="text-align: center;margin-top: 20%;">

		<form action="" id="form1">
			<table style="margin: 0 auto; ">
				<tr>
					<td><label class="txt">用户名：</label></td>
					<td><input id="username" type="text" class="put"
						placeholder="取个名字" /></td>
					<td>
						<div id="usernameTip" style="width:300px"></div>
					</td>
				</tr>
				<tr>
					<td><label class="txt">密码：</label></td>
					<td><input id="password" type="password" class="put"
						placeholder="密码" /></td>
					<td><div id="passwordTip" style="width:300px"></div></td>
				</tr>
				<tr>
					<td><label class="txt">密码确认：</label></td>
					<td><input id="repassword" type="password" class="put"
						placeholder="密码确认" /></td>
					<td><div id="repasswordTip" style="width:300px"></div></td>
				</tr>
				<tr>
					<td><label class="txt">邮箱(用于找回密码)：</label></td>
					<td><input id="email" type="text" class="put"
						placeholder="常用邮箱" /></td>
					<td>
						<div id="emailTip" style="width:300px"></div>
					</td>
				</tr>
				<tr>
					<td><label class="txt">你的角色：</label></td>
					<td style="color: rgb(129, 85, 85);"><input id="level1"
						name="level" type="radio" value="1" />学生 <input id="level2"
						name="level" type="radio" value="2" />老师 <input id="level3"
						name="level" type="radio" value="3" />家长</td>
					<td><div id="levelTip" style="width:300px"></div></td>
				</tr>
				<tr>
					<td><label class="txt">班级：</label></td>
					<td><input id="classnum" type="text" class="put"
						placeholder="你的班级号" /></td>
					<td><div id="classnumTip" style="width:300px"></div></td>
				</tr>
				<tr height="20px"></tr>
				<tr>
					<td></td>
					<td>

						<button id="submit" type="button" onclick="register()" class="bt">注册</button>
						<!-- 						<input id="reset" type="reset" value="重置" /> -->

					</td>
					<td></td>
				</tr>
			</table>
		</form>

	</div>
</body>
</html>
